import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class InviteCard extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      clipBehavior: Clip.none,
      children: [
        Container(
          width: 690.w,
          height: 717.h,
          margin: EdgeInsets.symmetric(horizontal: 30.w),
          decoration: BoxDecoration(
            gradient: const LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                Color(0xFFFFE6BC),
                Color(0xFFFE7C88),
              ],
            ),
            borderRadius: BorderRadius.circular(30.r),
          ),
          child: Padding(
            padding: EdgeInsets.all(16.w),
            child: Container(
              width: 658.w,
              height: 683.h,
              decoration: BoxDecoration(
                gradient: const LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: [
                    Color(0xFFFFE6BC),
                    Color(0xFFFFC9CE),
                  ],
                ),
                borderRadius: BorderRadius.circular(30.r),
                border: Border.all(
                  color: const Color(0xFFECA4A4),
                  width: 1.w,
                ),
              ),
              child: Column(
                children: [
                  SizedBox(height: 140.h),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Image.asset(
                        'assets/images/invite_friend_icon.png',
                        width: 48.w,
                        height: 48.h,
                      ),
                      SizedBox(width: 16.w),
                      ShaderMask(
                        shaderCallback: (Rect bounds) {
                          return const LinearGradient(
                            begin: Alignment.centerLeft,
                            end: Alignment.centerRight,
                            colors: [
                              Color(0xFFFFA444),
                              Color(0xFFF38714),
                            ],
                          ).createShader(bounds);
                        },
                        child: Text(
                          'Invite friends',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 48.sp,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 30.h),
                  Text(
                    'Invite friends to register and receive\n100 gold coins!',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: const Color(0xFF4E4E4E),
                      fontSize: 36.sp,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                  SizedBox(height: 40.h),
                  Container(
                    width: 598.w,
                    height: 121.h,
                    padding: EdgeInsets.symmetric(horizontal: 30.w),
                    decoration: BoxDecoration(
                      color: const Color(0xFFFEF9C2),
                      borderRadius: BorderRadius.circular(20.r),
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Row(
                          children: [
                            Image.asset(
                              'assets/images/invite_gold_coin.png',
                              width: 48.w,
                              height: 48.h,
                            ),
                            SizedBox(width: 16.w),
                            Text(
                              '100 gold coins',
                              style: TextStyle(
                                color: const Color(0xFFE56389),
                                fontSize: 36.sp,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ],
                        ),
                        Row(
                          children: [
                            Text(
                              '=',
                              style: TextStyle(
                                color: const Color(0xFF4E4E4E),
                                fontSize: 36.sp,
                              ),
                            ),
                            SizedBox(width: 16.w),
                            Text(
                              '\$10',
                              style: TextStyle(
                                color: const Color(0xFFE56389),
                                fontSize: 36.sp,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                  SizedBox(height: 40.h),
                  Container(
                    width: 583.w,
                    height: 101.h,
                    decoration: BoxDecoration(
                      gradient: const LinearGradient(
                        begin: Alignment.centerLeft,
                        end: Alignment.centerRight,
                        colors: [
                          Color(0xFFFE9165),
                          Color(0xFFFF5455),
                        ],
                      ),
                      borderRadius: BorderRadius.circular(50.r),
                    ),
                    child: Center(
                      child: Text(
                        'Copy invitation link',
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 36.sp,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
        Positioned(
          top: -114.h,
          left: 0,
          right: 0,
          child: Center(
            child: Image.asset(
              'assets/images/invite_box.png',
              width: 284.w,
              height: 282.h,
            ),
          ),
        ),
      ],
    );
  }
}
